.PLAY {
    cursor: url(../Assets/MainOptionMenu/curseur2.png) 4 12, default;
    z-index: 2;
    position: absolute;
    top: 0px;
    left: 450px;
    border: 0;
    line-height: 9.5;
    padding: 0 257px;
    font-size: 1rem;
    text-align: center;
    background-image: url("../Assets/MainOptionMenu/BOUTON_PLAY.png");
    background-color: transparent;
    display: block;
        margin : 320px auto;
}

.PLAY:hover {
    position: absolute;
    animation-name: BOUTON;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;

}

@keyframes BOUTON {
    0% { transform: scale(1, 1); }
    50%  { transform: scale(1.1, 1.1); }
    100%   { transform: scale(1, 1); }   
}


.OPTION {
    cursor: url(../Assets/MainOptionMenu/curseur2.png) 4 12, default;
    z-index: 2;
    position: absolute;
    top: 800px;
    left: 450px;
    border: 0;
    line-height: 9.5;
    padding: 0 257px;
    font-size: 1rem;
    text-align: center;
    background-image: url("../Assets/MainOptionMenu/BOUTON_OPTION.png");
    background-color: transparent;
    display: block;
        margin : -270px auto;
}

.OPTION:hover {
    position: absolute;
    animation-name: BOUTON;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;

}


legend{
    font-weight: bold;
    font-size: 150%;
      
}

label{
    font-weight: bold;
    font-size: 150%;

}

body{
    cursor: url(../Assets/MainOptionMenu/curseur.png) 4 12, default;
    background-image: url("../Assets/MainOptionMenu/MENU.png");
    background-attachment:fixed;
}


a{   
    text-decoration:none; 
}


.title {
    position: absolute;
    height: 760px;
    width: 1340px;
    background-image: url("../Assets/MainOptionMenu/title.png");
    background-color: transparent;
}

.QUE { 
    z-index: 1;
    position: absolute;
    animation-name: QUE;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    margin-left: -60px;
    margin-top: 220px;
}
 
@keyframes QUE {
    0% { transform: translate(0,  0px); }
    50%  { transform: translate(-15px, 15px); }
    100%   { transform: translate(0, -0px); }   
}

.BALLE { 
    z-index: 1;
    position: absolute;
    animation-name: BALLE;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    margin-left: 1050px;
    margin-top: 305px;
}
 
@keyframes BALLE {
    0% { transform: translate(0,  0px); }
    50%  { transform: translate(15px, 15px); }
    100%   { transform: translate(0, -0px); }   
}

.level1 {
    cursor: url(../Assets/MainOptionMenu/curseur2.png) 4 12, default;
    z-index: 2;
    position: absolute;
    top: 500px;
    left: 450px;
    border: 0;
    line-height: 9.5;
    padding: 0 257px;
    font-size: 1rem;
    text-align: center;
    background-image: url("../Assets/MainOptionMenu/LEVEL1.png");
    background-color: transparent;
    display: block;
        margin : -270px auto;
}
.level1:hover {
    position: absolute;
    animation-name: BOUTON;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;

}


.level2 {
    cursor: url(../Assets/MainOptionMenu/curseur2.png) 4 12, default;
    z-index: 2;
    position: absolute;
    top: 670px;
    left: 450px;
    border: 0;
    line-height: 9.5;
    padding: 0 257px;
    font-size: 1rem;
    text-align: center;
    background-image: url("../Assets/MainOptionMenu/LEVEL2.png");
    background-color: transparent;
    display: block;
        margin : -270px auto;
}

.level2:hover {
    position: absolute;
    animation-name: BOUTON;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;

}

.level3 {
    cursor: url(../Assets/MainOptionMenu/curseur2.png) 4 12, default;
    z-index: 2;
    position: absolute;
    top: 850px;
    left: 450px;
    border: 0;
    line-height: 9.5;
    padding: 0 257px;
    font-size: 1rem;
    text-align: center;
    background-image: url("../Assets/MainOptionMenu/LEVEL3.png");
    background-color: transparent;
    display: block;
    margin : -270px auto;
}

.level3:hover {
    position: absolute;
    animation-name: BOUTON;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;

}

.BACK {
    cursor: url(../Assets/MainOptionMenu/curseur2.png) 4 12, default;
    z-index: 2;
    position: absolute;
    top: 870px;
    left: 70px;
    border: 0;
    line-height: 9.5;
    height: 125px;
    padding: 0 62px;
    font-size: 1rem;
    text-align: center;
    background-image: url("../Assets/MainOptionMenu/back.png");
    background-color: transparent;
    display: block;
        margin : -270px auto;
}

.BACK:hover {
    position: absolute;
    animation-name: BOUTON;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;

}

.BACK_ig {
    cursor: url(../Assets/MainOptionMenu/curseur2.png) 4 12, default;
    z-index: 2;
    position: absolute;
    top: 920px;
    left: 20px;
    border: 0;
    line-height: 9.5;
    height: 75px;
    padding: 0 37px;
    font-size: 1rem;
    text-align: center;
    background-image: url("../Assets/Jeu/back_ig.png");
    background-color: transparent;
    display: block;
    margin : -270px auto;
}

.BACK_ig:hover {
    position: absolute;
    animation-name: BOUTON;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;

}
.SOURIS {
    cursor: url(../Assets/MainOptionMenu/curseur2.png) 4 12, default;
    z-index: 2;
    position: absolute;
    top: 0px;
    left: 450px;
    border: 0;
    line-height: 9.5;
    padding: 0 257px;
    font-size: 1rem;
    text-align: center;
    background-image: url("../Assets/MainOptionMenu/souris.png");
    background-color: transparent;
    display: block;
        margin : 320px auto;
}

.SOURIS:hover {
    position: absolute;
    animation-name: BOUTON;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;

}

.CLAVIER {
        cursor: url(../Assets/MainOptionMenu/curseur2.png) 4 12, default;
    z-index: 2;
    position: absolute;
    top: 800px;
    left: 450px;
    border: 0;
    line-height: 9.5;
    padding: 0 257px;
    font-size: 1rem;
    text-align: center;
    background-image: url("../Assets/MainOptionMenu/clavier.png");
    background-color: transparent;
    display: block;
        margin : -270px auto;
}

.CLAVIER:hover {
    position: absolute;
    animation-name: BOUTON;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;

}

.CHECK_clavier {
    z-index: 2;
    position: absolute;
    opacity: 1;
    top: 0;
    left: 0;
    border: 0;
    line-height: 9.5;
    padding: 0 257px;
    font-size: 1rem;
    text-align: center;
    background-image: url("../Assets/MainOptionMenu/check.png");
    background-color: transparent;
    display: block;
    margin-top: 41%;
    margin-left: 75%;
}

.CHECK_souris {
    z-index: 2;
    position: absolute;
    opacity: 1;
    border: 0;
    line-height: 9.5;
    padding: 0 257px;
    font-size: 1rem;
    top:0;
    left: 0;
    text-align: center;
    background-image: url("../Assets/MainOptionMenu/check.png");
    background-color: transparent;
    display: block;
    margin-top: 25%;
    margin-left: 75%;
}

#jeu {
    z-index: 2;
    position: absolute;
  width: 1100px;
  height: 650px;
  margin-top: 1%;
  margin-left: 133px;
  margin-right: auto;
}

.FOND_ig {
    opacity: 1;
    z-index: 1;
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("../Assets/Jeu/FOND_ig.png");
}
.FOND_lose {
    opacity: 0;
    z-index: 2;
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("../Assets/Jeu/FOND_lose.png");
}


.vie1 {
    margin-top: 10px;
    margin-left: 10px;
    z-index: 3;
    position: absolute;
    width: 90px;
    height: 85px;
    background-image: url("../Assets/Jeu/vie.png");
    position: absolute;
    animation-name: BOUTON;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

.mort1 {
    opacity: 0;
    margin-top: 10px;
    margin-left: 10px;
    z-index: 3;
    position: absolute;
    width: 90px;
    height: 85px;
    background-image: url("../Assets/Jeu/mort.png");
}

.vie2 {
    margin-top: 100px;
    margin-left: 10px;
    z-index: 3;
    position: absolute;
    width: 90px;
    height: 85px;
    background-image: url("../Assets/Jeu/vie.png");
    animation-name: BOUTON;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

.mort2 {
    opacity: 0;
    margin-top: 100px;
    margin-left: 10px;
    z-index: 3;
    position: absolute;
    width: 90px;
    height: 85px;
    background-image: url("../Assets/Jeu/mort.png");
}

.vie3 {
    margin-top: 195px;
    margin-left: 10px;
    z-index: 3;
    position: absolute;
    width: 90px;
    height: 85px;
    background-image: url("../Assets/Jeu/vie.png");
    animation-name: BOUTON;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

.mort3 {
    opacity: 0;
    margin-top: 195px;
    margin-left: 10px;
    z-index: 3;
    position: absolute;
    width: 90px;
    height: 85px;
    background-image: url("../Assets/Jeu/mort.png");
}

.START {
    opacity: 1;
    margin-top: 350px;
    margin-left: 170px;
    z-index: 3;
    position: absolute;
    width: 1000px;
    height: 100px;
    background-image: url("../Assets/Jeu/START.png");
    animation-name: BOUTON;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    
}

.GAME_OVER {
    opacity: 0;
    margin-top: 30px;
    margin-left: 290px;
    z-index: 3;
    position: absolute;
    width: 800px;
    height: 400px;
    background-image: url("../Assets/Jeu/GAME_OVER.png");
    animation-name: BOUTON;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

.YOU_WIN {
    opacity: 0;
    margin-top: 30px;
    margin-left: 290px;
    z-index: 3;
    position: absolute;
    width: 800px;
    height: 400px;
    background-image: url("../Assets/Jeu/YOU_WIN.png");
    animation-name: BOUTON;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
.F11 {
    opacity: 1;
    margin-top: 270px;
    margin-left: 255px;
    z-index: 3;
    position: absolute;
    width: 855px;
    height: 75px;
    background-image: url("../Assets/MainOptionMenu/F11.png");
    animation-name: BOUTON;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

.BLACKSCREEN {
    opacity: 1;
    margin-top: -16px;
    margin-left: -8px;
    z-index: 1;
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: black;
}